<script setup lang="ts">
     import { KeepAlive } from 'vue';
    import { useUserStore } from './store/user';
    import {storeToRefs} from 'pinia'
    import pinia from './store/pinia'
    const userStore = useUserStore(pinia);
    let {spin} = storeToRefs(userStore)
    import { Reload } from '@vicons/ionicons5'
    import { NMessageProvider } from 'naive-ui'
</script>

<template>
  <n-message-provider>
    <n-spin :show="spin" style="height: 100%;">
        <template #icon>
            <n-icon>
                <Reload />
            </n-icon>
        </template>
        <template #description>
            加载中...
        </template>
       <router-view #default="{Component}">
            <keep-alive>
                <component :is="Component" v-if="$route.meta.KeepAlive"/>
            </keep-alive>
            <component :is="Component" v-if="!$route.meta.KeepAlive"/>
       </router-view>
    </n-spin>
  </n-message-provider>
</template>

<style scoped>
    :deep(.n-spin-content) {
        height: 100%;
    }
</style>
